/* 外部样式 */
/* 样式初始化 */
body,ul,li,p{
  margin:0;  /* 外边距为0 */
  padding:0;  /* 内边距为0 */
}
ul{
  list-style-type:none;
}
/*  一级导航条样式  */
ul.one{
  width:800px; /* 设置宽度 */
  height:50px; /* 设置高度 */
  border:1px solid black; /* 设置边框属性：1px粗细，实线，黑色 */
  margin:0 auto; /* 设置外边距 上下为0 左右为auto */
}
ul.one > li {
/*  想让块级元素（默认独占一行，从上到下依次排列）在一行中显示  */
  float:left; /* 设置 左浮动 */
  width:25%;
  height:50px;
  text-align:center; /* 让文本文字或者行内元素水平居中 */
  line-height:50px; /* 设置 行高属性值 为高度值 文字垂直居中 */
}
ul.one > li > p:hover{
  background-color:#ccc; /* 设置背景颜色 */
  color:rgb(0,0,255); /* 设置文本颜色 */
}
/* 二级导航条样式 */
ul.two{
  display:none; /* 设置显示方式：不显示 */
  position:relative;    /* 给子元素绝对路径 参照物作用  */
}
ul.one > li:hover > ul.two {
  display:block; /* 设置显示方式：块级元素显示方式 */
}
/* 三级导航条样式  */
ul.three{
    /* 位置调整 */
    position:absolute;
    left:200px;
    top:0px;
    width:200px;
    display:none;
}
ul.two > li:hover > ul.three{
    display:block;
}